@CHARSET "ISO-8859-1";
.item{
    position: relative;
    background-color:   rgba(120, 187, 237, 0.2);
    float:left;
	width:17%;
    max-width:33%;
    margin:0px 4px;
    height:90px;
    /*border:6px ridge  #ddd;*/
    -moz-border-radius:25px;
    -webkit-border-radius:25px;
    border-radius:25px;
    -moz-box-shadow:1px 1px 10px  #64758a;
    -webkit-box-shadow:1px 1px 10px  #64758a;
    box-shadow:7px 7px 10px  #64758a;
    cursor: pointer;
    overflow: hidden;
    color: black;
}

.link{
	float: left;
    top:1px;
    position: absolute;
    width:24%;
    max-width: 24%;
    height:48px;
    
}
.item_content{
    position: absolute;
    height:52px;
    width:90px;
    overflow:hidden;
    float:left;
    top:7px;
    background:transparent;
    display:none;
    color: black;
}

.item_content a{
    background-color:transparent;
    float:left;
    margin-top:2px;
    color: black;
    text-shadow: 1px 1px 1px #fff;
    
    font-size:15px;
}
.item_content a:hover{
    color:#0b965b;
}

p.texto
 {
 	font-weight: bold;
	font-size: 1em;
	color: black;
	text-align: left;
	padding-top: 40px;
	opacity: 1;
	float: center;
	
 }




*{
	margin: 0px;
	padding: 0px;
	font-family: verdana;
 }
nav
 {
	margin: 1% auto;
	margin-left:auto;
	margin-right:auto;
	max-width: 95%;
	height: 90px;
	horizontal-align:center;
	text-align: center;

 }
 div.contenedor
 {
 	margin-left:.5%;
	width:100%;
	max-width: 100%;
	height: 160px;
	float: left;
	-webkit-transition: height .4s;
	text-align: center;
 }
 div#uno
 {
	background-color: rgba(177, 151, 93, 0.6);
 }
 div#dos
 {
	background-color:   rgba(196, 203, 204, 0.4);
 }
 div#tres
 {
	background-color: rgba(216, 156, 92, 0.6);
 }
 div#cuatro
 {
	background-color: rgba(71, 112, 191, 0.6);
 }
 
 img.icon
 {
	display: block;
	margin: 2px auto;
	/*background-color: rgba(0,0,0,.15);*/
	width: 60px;
	height:60px;
	padding: 0px;
	-webkit-border-radius: 20%;
	-moz-border-radius: 20%;
	-ms-border-radius: 20%;
	-webkit-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
	-moz-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
	-ms-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
	box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
	-webkit-transition:box-shadow .4s;
	-moz-transition:box-shadow .4s;
	-ms-transition:box-shadow .4s;
 }
 p.texto
 {
	font-size: 1em;
	color: black;
	text-align: center;
	padding-top: 0px;
	opacity: 0.4;
	-webkit-transition: padding-top 0.4s;
 }
 div.contenedor:hover
 {
	height:160px;
 }
 div.contenedor:hover p.texto
 {
	padding-top: 4px;
	opacity: 1;
 }
 div.contenedor:hover img.icon
 {
	-webkit-box-shadow: 0px 0px 0px rgba(255, 255,255, .4);
	-moz-box-shadow: 0px 0px 0px rgba(255, 255,255, .4);
	-ms-box-shadow: 0px 0px 0px rgba(255, 255,255, .4);
	box-shadow: 0px 0px 0px rgba(255, 255,255, .4);
 }
 nav
 {
   position: relative;
   z-index: 0;
 }
 
 
 
.desplaza80
{
webkit-transform: translateX(35%);
-ms-transform: translateX(35%);
-moz-transform: translateX(35%);
transform: translateX(35%);
}


.desplaza20
{
webkit-transform: translateX(20%);
-ms-transform: translateX(20%);
-moz-transform: translateX(20%);
transform: translateX(20%);
}

.desplaza120
{
webkit-transform: translateX(120%);
-ms-transform: translateX(120%);
-moz-transform: translateX(120%);
transform: translateX(120%);
}
.desplaza155
{
webkit-transform: translateX(157%);
-ms-transform: translateX(157%);
-moz-transform: translateX(157%);
transform: translateX(157%);
}